<template>
    <div class="dormitory-detail">
        <el-page-header @back="goBack" content="详情页面">
        </el-page-header>

        <el-descriptions style="margin-top: 20px;" direction="vertical" :column="4" border>
            <el-descriptions-item label="宿舍号">{{ dormitoryInfo.roomNo }}</el-descriptions-item>
            <el-descriptions-item label="宿舍所属单位">{{ dormitoryInfo.campusName + ' ' + dormitoryInfo.parkName + ' ' +
                dormitoryInfo.buildingName + ' ' +
                dormitoryInfo.unitName + ' ' +
                dormitoryInfo.floor + "楼" }}</el-descriptions-item>
            <el-descriptions-item label="住宿性别" :span="2">{{ dormitoryInfo.gender }}</el-descriptions-item>
            <el-descriptions-item label="备注">
                <el-tag size="small">宿舍</el-tag>
            </el-descriptions-item>
            <el-descriptions-item label="宿舍类型">{{ dormitoryInfo.bedList | filterBed }} 间</el-descriptions-item>
        </el-descriptions>

        
    </div>
</template>

<script>
import {
    getDormitory
} from "@/api/dormitory/basedata/dormitory";

export default {
    name: 'SRSUiDetailView',

    data() {
        return {
            dormitoryInfo: {}
        };
    },

    mounted() {
        this.getDormitoryDetail()
    },

    methods: {
        getDormitoryDetail() {
            getDormitory(this.$route.query.dormitoryId).then(res => {
                this.dormitoryInfo = res.data
                console.log(this.dormitoryInfo);
            })
        },
        goBack() {
            this.$router.push({ path: '/dormitory/baseinfo/dormitoryInfo' })
        }
    },
    filters: {
        filterBed(value) {
            if (!value) return
            return value.length
        }
    }
};
</script>

<style lang="scss" scoped>
.dormitory-detail {
    padding: 20px;
}
</style>